<template>
  <div class="app-container">
      <h4>用户信息</h4>
      <table class="table table-striped table-condenseda table-bordered" width="100%">
        <tbody>
          <tr>
                <th width="15%">手机号</th>
                <td width="35%"><b>{{ userInfo.phone }}</b></td>
                <th width="15%">用户姓名</th>
                <td width="35%">{{ userInfo.name }}</td>
            </tr>
          <tr>
            <th>状态</th>
            <td>{{ userInfo.status == 0 ? '锁定' : '正常' }}</td>
            <th>注册时间</th>
            <td>{{ userInfo.createTime }}</td>
          </tr>
        </tbody>
      </table>
      <h4>认证信息</h4>
      <table class="table table-striped table-condenseda table-bordered" width="100%">
          <tbody>
            <tr>
                <th  width="15%">姓名</th>
                <td width="35%"><b>{{ userInfo.name }}</b></td>
                <th width="15%">证件类型</th>
                <td width="35%">{{ userInfo.certificatesType }}</td>
            </tr>
            <tr>
                <th style="vertical-align:middle">证件号</th>
                <td style="vertical-align:middle">{{ userInfo.certificatesNo }}</td>
                <th style="vertical-align:middle">证件图片</th>
                <td style="vertical-align:middle">
                  <img :src="userInfo.certificatesPositiveUrl" width="80px">
                  <img :src="userInfo.certificatesBackUrl" width="80px">
                </td>
            </tr>
          </tbody>
      </table>
    <h4>就诊人信息</h4>
    <el-table  :data="patientList" stripe style="width: 100%">
        <el-table-column label="序号" width="70" align="center">
          <template slot-scope="scope">
                  {{ scope.$index + 1 }}
          </template>
        </el-table-column>
        <el-table-column prop="name" align="center" label="姓名"/>
        <el-table-column  align="center" prop="param.certificatesTypeString" label="证件类型"/>
        <el-table-column align="center" width="160" prop="certificatesNo" label="证件编号"/>
        <el-table-column align="center" label="性别">
          <template slot-scope="scope">
                {{ scope.row.sex == 1 ? '男' : '女' }}
          </template>
        </el-table-column>
        <el-table-column align="center" prop="birthdate" label="出生年月"/>
        <el-table-column align="center"  width="110" prop="phone" label="手机"/>
        <el-table-column align="center" label="是否结婚">
          <template slot-scope="scope">
                  {{ scope.row.isMarry == 1 ? '已婚' : '未婚' }}
          </template>
        </el-table-column>
        <el-table-column prop="param.fullAddress" align="center" width="200" label="地址"/>
        <el-table-column prop="createTime" align="center" width="150" label="注册时间"/>
      </el-table>
      <br>
      <el-row>
        <el-button  @click="back">返回</el-button>
      </el-row>
  </div>
</template>
<script>
import userInfoApi from '@/api/userInfo'
export default {
  // 定义数据
  data() {
    return {
      id: this.$route.params.id,
      userInfo: {}, // 会员信息
      patientList: [] // 就诊人列表
    }
  },
  // 当页面加载时获取数据
  created() {
    this.fetchDataById()
  },
  methods: {
    // 根据id查询会员记录
    fetchDataById() {
      userInfoApi.findUserSetById(this.id).then(response => {
        this.userInfo = response.data.userInfo
        this.patientList = response.data.patientList
      })
    },
    back() {
      window.history.back(-1)
    }
  }
}
</script>
